<template>
  <div class="signin_box">
    <!-- 账号密码登录 -->
    <div class="signinAccount">
      <span>用户名</span>
      <input @input="onKeyPhone" type="text" placeholder="请输入用户名" />
    </div>
    <div class="signinPassword">
      <span>密 码</span>
      <input @input="onKeyPassword" class="weui-input" password type="text" placeholder="请输入密码" />
    </div>

    <!-- 登录but -->
    <div class="signinbut" @tap="login()">登 录</div>

    <!-- 找回密码&注册 -->
    <div class="signinAbility">
      <span>忘记密码</span>
      <div @click="ToRegister">
        <span>新用户</span>
        <span>注册</span>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props: {},
  data() {
    return {
      inputPhone: '',
      inputPassword: ''
    }
  },
  computed: {},
  created() {},
  mounted() {},
  watch: {},
  methods: {
    onKeyPhone: function(event) {
      this.inputPhone = event.target.value
    },
    onKeyPassword: function(event) {
      this.inputPassword = event.target.value
    },
    // 普通登陆
    login() {
      var that = this
      if(!(/^1[3456789]\d{9}$/.test(that.inputPhone))){
        wx.showToast({
          title: '请输入正确手机号',
          icon: 'none',
          duration: 2000
        });
        return false
      }
      if(!that.inputPassword.trim()){
        wx.showToast({
          title: '请输入密码',
          icon: 'none',
          duration: 2000
        });
        return false
      }
      that.request({
        url: that.baseUrl + '/api/wechatapp/login',
        data:{
          login_type: 1,
          mobile: that.inputPhone,
          password: that.inputPassword,
        },
        method: 'POST',
      })
      .then(result=>{
        // console.log(result.data.user_login)
        if(result.status == 200){
          wx.setStorage({
            key: 'userInfo',
            data: result.data.user_login,
          })
          wx.reLaunch({
            //跳转到小程序首页
            url: "/pages/index/main"
          });
          // this.personal_center_content = result.data.personal_center_content; //介绍
        } else {
          // wx.navigateTo({
          //   //跳转到注册
          //   url: "/pages/register/main"
          // });
          wx.showToast({
            title: result.msg,
            icon: 'none',
            duration: 2000
          });
          return false
        }
      })
    },
    //跳转注册页面
    ToRegister() {
      wx.navigateTo({
        url: "../register/main",
      });
    },
  },
  components: {},
};
</script>

<style >
page {
  background-color: #ffffff;
}
.signinAccount {
  margin-top: 120rpx;
  height: 96rpx;
  line-height: 96rpx;
  padding: 20rpx 40rpx;
  display: flex;
  align-items: center;
  border-top: 1rpx solid #eeeeee;
}
.signinAccount input,
.signinPassword input {
  flex: 2;
  margin-right: 130rpx;
}
.signinPassword {
  height: 96rpx;
  padding: 20rpx 40rpx;
  line-height: 96rpx;
  display: flex;
  align-items: center;
  border-top: 1rpx solid #eeeeee;
  border-bottom: 1rpx solid #eeeeee;
}
.signinPassword span,
.signinAccount span {
  flex: 1;
}
.signinbut {
  /* width: 702rpx; */

  height: 98rpx;
  line-height: 98rpx;
  text-align: center;
  background: #1677ff;
  border-radius: 8rpx;
  margin: 50rpx 30rpx;
  color: #ffffff;
}
.signinAbility {
  display: flex;
  justify-content: space-between;
  margin: 0 30rpx;
  font-size: 28rpx;
}
.signinAbility > div:nth-child(2) > span:nth-child(2) {
  color: #1677ff;
}
</style>
